<template>
  <div class="common-body-wrapper">
    <search-header single-width="130" :searchList="searchList" @changeHeight="toRetTable" @confirmSearch="toSearch"
    :isNeedTree="true" :isCheckbox="true" :paramName="paramName" @setSelectedNode="setSelectedNode"></search-header>
    <div class="common-table-tree-wrapper">
      <div class="common-table-wrapper">
        <multi-fun-table :sortColumn='notFormatColumn' :orderType='sortType' :fixed-cols="fixedCols" :is-reset-table="isResetTable" :theads-info="theadsInfo" :tbodys-info="tbodysInfo" @handleMultiCheck="handleMultiCheck" @handleSortColumn="handleSortColumn" @searchFn="getList" @getNextPage="getNextPage">
          <!--按钮-->
          <div class="operate-btn-group" slot="operateBtnGroup">
            <a class="ake_btn ake_btn_text" v-if="isPermmited('SCORE:RECORD:EXPORT')" @click.prevent="exportWater()">导出</a>
          </div>

          <!--普通列-->
          <template slot="tdCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" :min-width="props.minWidth" :width="props.width" :prop="props.prop" :sortable="props.sortable">
              <template slot-scope="scope">
                <span v-if="'reno' == props.prop&&scope.$index!==0">{{ scope.$index }}</span>
                <span v-else-if="'reno' == props.prop&&scope.$index==0">合计</span>
                <span v-else-if="'reliefValue' == props.prop">{{ scope.row.reliefValue |formatMoney }}</span>
                <span v-else :title="scope.row[props.prop]">{{ scope.row[props.prop] }}</span>
              </template>
            </el-table-column>
          </template>

          <!--操作列内的按钮-->
          <template slot="operateCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" width="100">
              <template slot-scope="scope">
                <el-button v-if="isPermmited('SCORE:RECORD:RESYNC') &&scope.$index!==0" size="small" type="primary" icon="icon-synchronize" class="ake-icon-font" title="重新同步" @click="toReSync(scope.row)" plain></el-button>
              </template>
            </el-table-column>
          </template>
        </multi-fun-table>

        <!---->
        <table-pagination :size="total" :cur-page="pageNumber" @backData="getPagination"></table-pagination>
      </div>
    </div>
  </div>
</template>

<script>
import common from '@mixins/common.js'
import stardardList from '@mixins/tables/stardardList.js'

//modal
import invokeModal from '@mixins/modal/invokeModal.js'
// import BigPicModal from '@components/widgets/BigPicModal.vue'

// image
// import images from '@mixins/image.js'

// 引进vue的js
import js from './js/record_water.js'

export default {
  name: 'scoreRecordWater',
  mixins: [common, stardardList, invokeModal, js],
  data() {
    const today = [new Date(moment().format('YYYY-MM-DD 00:00:00')), new Date(moment().format('YYYY-MM-DD 23:59:59'))];
    return {
      total: 0,
      fixedCols: 4,
      paramName: 'query_parkId',
      searchList: [
        { index: 0, isShow: false, type: 'datePicker', name: 'query_payTime', text: '支付时间', propName: 'query_payTimeFrom,query_payTimeTo', value: today, style: { width: '360px' } },
        { index: 1, isShow: false, type: 'text', name: 'query_carCode', text: '车牌编号', value: '' },
        { index: 2, isShow: false, type: 'text', name: 'query_userPhone', text: '车主电话', value: '' },
      ],
      theadsInfo: [
        // { index: 0, isShow: false, prop: 'reno', text: '序号', width: 68 },
        { index: 1, isShow: false, prop: 'parkName', text: '停车场', minWidth: 50 },
        { index: 2, isShow: false, prop: 'userPhone', text: '手机号码', minWidth: 60 },
        { index: 3, isShow: false, prop: 'carCode', text: '车牌号码', minWidth: 60 },
        { index: 4, isShow: false, prop: 'payTime', text: '支付时间', minWidth: 80 },
        { index: 5, isShow: false, prop: 'reliefScore', text: '抵扣积分数', minWidth: 50 },
        { index: 6, isShow: false, prop: 'reliefValue', text: '车场积分金额(元)', minWidth: 60 },
        { index: 7, isShow: false, prop: 'scoreRecordCode', text: '积分流水号', minWidth: 60, initHidden: true },
        { index: 8, isShow: false, prop: 'billCode', text: '支付流水号', minWidth: 60, initHidden: true },
        { index: 9, isShow: false, prop: 'thirdBillCode', text: '第三方支付流水', minWidth: 60, initHidden: true },
        { index: 10, isShow: false, prop: 'createTime', text: '生成时间', minWidth: 80, initHidden: true },
        { index: 11, isShow: false, prop: 'payOriginDisplay', text: '支付来源', minWidth: 50, initHidden: true },
        { index: 12, isShow: false, prop: 'payModeDisplay', text: '支付方式', minWidth: 50, initHidden: true },
        { index: 13, isShow: false, prop: 'sendStatusDisplay', text: '同步状态', minWidth: 40, initHidden: true },
        { index: 14, isShow: false, prop: 'sendStatusRemark', text: '同步备注', minWidth: 50, initHidden: true },
      ],
      tbodysInfo: []
    }
  }
}
</script>

<style lang="less">
.config-modal {
  padding-bottom: 30px;
  .first-item {
    width: 240px;
  }
  .modal-body {
    // max-height: 500px;
    // min-height: 300px;
    overflow-y: scroll;
  }
  .select-park-textarea {
    display: block;
    margin-top: 10px;
    color: #333;
  }
  .el-textarea.is-disabled .el-textarea__inner {
    color: #333 !important;
  }
  .config-rule {
    width: 120px;
  }
}
</style>
